<template>
  <div>
    <van-nav-bar
      v-for="(item, index) in title"
      :key="index"
      class="header"
      :title="item.name"
      left-arrow
      @click-left="onClickLeft"
    >
      <span class="more" slot="right">
        <img :src="item.imgUrl" alt />
      </span>
    </van-nav-bar>
  </div>
</template>

<script>
export default {
  name: "NavBar",
  data() {
    return {
      title: []
    };
  },
  methods: {
    onClickLeft() {
      this.$router.go(-1);
    }
  },
  mounted() {
    console.log(this.$parent.title);
    this.title = this.$parent.title;
  }
};
</script>

<style lang="scss">
.more {
  display: block;
  height: 100%;

  img {
    width: 0.666667rem;
    height: 0.133333rem;
  }
}
</style>